<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue常见指令</title>
    <script src="../js/vue.js"></script>
</head>
<body>
<!--
{{info}}                 不能识别html标签       不会替换标签中的原有内容
v-text  类似 innerText   不能识别html标签       替换标签中的原有内容
v-html  类似 innerHTML   识别html标签          替换标签中的原有内容
-->
<div id="app">

</div>

<script type="text/javascript">
    const vm = new Vue({
        template: `
                <div>
                    <p v-text="name">学生姓名:</p>
                    <p v-html="name">学生姓名:</p>
                </div>
        `,
        data: {
            name: '<b>tom</b>'
        },

    })
    vm.$mount("#app")
</script>
</body>
</html>
